<template>
  <div class="edit">
    <!-- 页面标题 -->
    <hm-nav-bar
      title="昵称"
      path="/home/editInfo"
      right="保存"
      @rightClick="backEditInfo"
    ></hm-nav-bar>
    <!-- 插件 -->
    <div class="editNickname">
      <van-field
        v-model="userInfo.name"
        rows="1"
        autosize
        border="true"
        type="textarea"
        maxlength="10"
        placeholder="请输入昵称"
        show-word-limit
        class="field"
      />
    </div>
  </div>
</template>
<script>
import { getUserId, getUserProfile } from '@/api/my.js'

export default {
  name: 'edit',
  data () {
    return {
      // userInfo
      userInfo: '',
      value: ''
    }
  },
  created () {
    this.getUserProfile()
    this.getUserId()
  },
  methods: {
    getUserId () {
      getUserId().then(res => {
        console.log(res)
      })
    },
    getUserProfile () {
      getUserProfile().then(res => {
        console.log(res)
        this.userInfo = res.data
      })
    },
    backEditInfo () {
      this.$toast.success('修改成功')
      this.$router.go(-1)
    }
  }
}
</script>
<style lang="less" scoped>
.edit {
  height: 100vh;
  background-color: #f9f9f9;
  padding-top: 50px;
  .editNickname {
    margin: 10px;
    border: 1px solid #eee;
    .field {
      font-size: 16px;
    }
  }
}
</style>
